<%@ page language="java" pageEncoding="UTF-8"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
	<head> 
		<base target="_self" />
	  	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
		<meta http-equiv="pragma" content="no-cache"/>
		<meta http-equiv="cache-control" content="no-cache"/>
		<meta http-equiv="expires" content="0"/>
		<meta http-equiv="X-Ua-Compatible" content="IE=EmulateIE7" />
		<title>首页</title>
		<link href="<s:url value='/css/base.css'/>" rel="stylesheet" type="text/css" />
		<script type="text/javascript" src="<s:url value='/js/jquery-1.3.2.min.js'/>"></script>
		<jsp:include page="/head.jsp"></jsp:include>
		<script type="text/javascript">
			function callAjax(url,data,success){
				$.ajax({url:url,
					   data:data,cache:false,success:success,
					   type: "POST",dataType:"json",timeout:100000, 
					   error:function(){
						   $.dialog.alert("操作异常");
						},
						dataFilter:function (data, type) {
						    // 对Ajax返回的原始数据进行预处理 
						    //alert(data);
						    return data; // 返回处理后的数据  
						} 
						
					});  
			}
			function obtainTableColumn(){
				var table = $("#table").val();
				if($.trim(table)==""){
					 $.dialog.alert("请选择您要操作的数据");
					 return false;
				}
				var url = "<s:url value='/data-me/data-getColumnByTable.action'/>";
				var $div=$("div.mainright_01");
				//清除上次添加的东西
				$div.empty();
				//查询指定表的列名
				var data = {'tableName':table};
				callAjax(url,data,function(o){
					 if(o!=null&&o['table']!=null&&o['table']['columnlist']!=null){
						 var $template=$("#template");
						 for(var i=0;i<o['table']['columnlist'].length;i++){
							 var column = o['table']['columnlist'][i];
							 var $template_clone = $template.clone() ;
							 var columnName=column["columnName"];
							 $template_clone.find("#template_checkbox").removeAttr("id").val(columnName);
							 $template_clone.find("#template_columnName").removeAttr("id").text(columnName);
							 $template_clone.find("#template_columnType").removeAttr("id").text(column["columnType"]);
							 $template_clone.find("#template_remark").removeAttr("id").text(column["remark"]);
							 $div.append($template_clone.contents());
						 }
					 }
				     else{
				    	 $.dialog.alert("未查询到"+table+"的相关列");
				     }
				});
			}
			
		</script>
	</head>
<body>
	<div style="position: relative;top: 50px;left: 20px;vertical-align: baseline;line-height: 12px;padding-left: 5px;">
		<div class="mainleft">
			<span class="mainspan">以下是数据库中的表</span><br />
			<select id="table">
				<option value="">-------请选择-------</option>
				<s:if test="#request.tablelist!=null">
					<s:iterator var="tablelist" value="#request.tablelist">
						<option value="<s:property/>"><s:property/></option>
					</s:iterator>
				</s:if>
			</select>
			<input type="button" value="操作" onclick="obtainTableColumn();"/>
		</div>
		<div class="mainright">
			<span class="mainspan">你选中的表的列</span>
			<div class="mainright_01">
			</div>
		</div>
		<div id="template" style="display: none;">
			<table width="560px" border="0" cellspacing="0" cellpadding="0">
              <tr>
                <td width="1%" align="right" nowrap="nowrap"><input type="checkbox" id="template_checkbox" value="" /></td>
                <td width="20%" id="template_columnName" nowrap="nowrap"></td>
                <td width="20%" id="template_columnType" nowrap="nowrap"></td>
                <td width="30%" id="template_remark" style="text-overflow:ellipsis"></td>
              </tr>
            </table>
			<span></span><br/>
		</div>
		
	</div>
</body>
</html>